// 获取导航栏元素
var navTop = document.querySelector(".nav-top");
var tabBox = document.querySelector(".tab-box");
// 监听滚动事件
window.addEventListener("scroll", function () {
  // 获取页面的滚动位置
  var scrollTop = window.pageYOffset || document.documentElement.scrollTop;

  // 判断滚动位置是否大于0
  if (scrollTop > 0) {
    // 如果滚动位置大于0，改变导航栏的高度和背景色
    navTop.style.height = "70px";
    navTop.style.backgroundColor = "rgba(0, 0, 0, 0.72)";
    tabBox.style.bottom = "-190px";
  } else {
    // 如果滚动位置小于等于0，恢复导航栏的原始样式
    navTop.style.height = "150px";
    // 这里假设原始背景色是透明，如果需要其他颜色，请自行设置
    navTop.style.backgroundColor = "";
    tabBox.style.bottom = "-150px";
  }
});


// 头部显示隐藏效果
document.addEventListener("DOMContentLoaded", function () {
  var zhanshibox = document.getElementById("zhanshibox");
  var tabBox = document.querySelector(".tab-box");

  zhanshibox.addEventListener("mouseover", function () {
    tabBox.style.display = "block";
  });

  tabBox.addEventListener("mouseover", function () {
    tabBox.style.display = "block";
  });

  document.addEventListener("mouseover", function (event) {
    if (!tabBox.contains(event.target) && !zhanshibox.contains(event.target)) {
      tabBox.style.display = "none";
    }
  });
});



// 返回顶部按钮
window.addEventListener('scroll', function() {
  var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
  if (scrollTop > 200) {
      document.querySelector('.bottom-top').style.display = 'block'; // 显示元素
  } else {
      document.querySelector('.bottom-top').style.display = 'none'; // 隐藏元素
  }
});
